<!DOCTYPE html>
<html>
<head>
    <title>运费模板表</title>
    <#include "/header.html">
</head>
<body>
<div id="rrapp" v-cloak>
    <div v-show="showList">
        <div class="grid-btn">
            <form class="form-inline" role="form">
                &nbsp;&nbsp;
                <a @click="reset"><i class="fa fa-refresh"></i></a>
                <div class="form-group">
                    <el-input placeholder="请输入内容" size="small" v-model="q.templateName" clearable placeholder="运费模板名"></el-input>
                </div>
                &nbsp;&nbsp;
                <el-button type="primary" size="small" @click="add" plain>新增</el-button>
                <el-button type="primary" icon="el-icon-search" size="small" @click="query" plain>查询</el-button>
            </form>
        </div>
        <el-table :data="freightTemplateList" size="mini" highlight-current-row="true" style="width: 100%">
            <el-table-column prop="templateName"  label="运费模板名" ></el-table-column>
            <el-table-column  label="模板类型" width="180">
                <template slot-scope="scope">
                    <span v-if="scope.row.templateType == 'shop'">店铺</span>
                    <span v-if="scope.row.templateType == 'sku'">单品</span>
                </template>
            </el-table-column>
            <el-table-column  label="是否免邮">
                <template slot-scope="scope">
                    <span v-if="scope.row.freeShipping == 1">包邮</span>
                    <span v-if="scope.row.freeShipping == 0">不包邮</span>
                </template>
            </el-table-column>
            <el-table-column prop="valuationWay" label="计价规格" >
                <template slot-scope="scope">
                    <span v-if="scope.row.valuationWay == 'weight'">按重量计价</span>
                    <span v-if="scope.row.valuationWay == 'unit'">按件数计价</span>
                </template>
            </el-table-column>
            <el-table-column prop="firstUnit" label="首重(件)" ></el-table-column>
            <el-table-column prop="firstPrice" label="首重(件)费用"></el-table-column>
            <el-table-column prop="continueUnit" label="续重(续件)" ></el-table-column>
            <el-table-column prop="continuePrice" label="续重(续件)费用" ></el-table-column>
            <el-table-column prop="sellerId" label="卖家id"></el-table-column>
            <el-table-column prop="defTemplate" label="是否默认模板" >
                <template slot-scope="scope">
                    <span v-if="scope.row.defTemplate == '0'">不是默认模板</span>
                    <span v-if="scope.row.defTemplate == '1'">默认模板</span>
                </template>
            </el-table-column>
            <el-table-column prop="providerType" label="type"></el-table-column>
            <el-table-column  label="操作" width="250">
                <template slot-scope="scope">

                    <el-button type="primary" size="small" @click="del(scope.row.templateId)" plain>删除</el-button>
                    <el-button type="primary" size="small" @click="update(scope.row.templateId)" plain>编辑</el-button>
                </template>
            </el-table-column>
        </el-table>
        <div class="block text-right">
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="1"
                    :page-sizes="[page.size, 2*page.size, 4*page.size]"
                    :page-size="page.pageSize"
                    :total="page.total">
            </el-pagination>
        </div>
    </div>
    <div v-show="!showList">
        <div class="panel-heading">{{title}}</div>
        <form class="form-horizontal" style="width: 100%">
            <div class="form-group " hidden>
                <div class="col-sm-2 control-label">模板ID:</div>
                <div class="col-sm-1">
                    <input type="text" class="form-control" v-model="freightTemplate.templateId" readonly="readonly" placeholder="模板id"/>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">模板名称:</div>
                <div class="col-sm-2">
                    <input type="text" class="form-control" v-model="freightTemplate.templateName" placeholder="模板名称"/>
                </div>
            </div>
            <!--<div class="form-group">-->
                <!--<div class="col-sm-2 control-label">模板类型:</div>-->
                <!--<div class="col-sm-2">-->
                    <input  class="form-control" v-model="freightTemplate.providerType" type="hidden" placeholder="模板类型"/>
                <!--</div>-->
            <!--</div>-->
            <div class="form-group">
                <div class="col-sm-2 control-label">是否包邮:</div>
                <div class="col-sm-1">
                    <select class="form-control" v-model="freightTemplate.freeShipping">
                        <option class="form-control"  value="0">不包邮</option>
                        <option class="form-control" value="1">包邮</option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">计价规则:</div>
                <div class="col-sm-1">
                    <select class="form-control" v-model="freightTemplate.valuationWay">
                        <option class="form-control" value="unit">按件计价</option>
                        <option class="form-control" value="weight">按重量计价</option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">运送方式:</div>
                <div class="col-sm-10">
                    <table id="trFreight" class="controls table-striped table-bordered table-condensed" style="width: 100%;">
                        <tr >
                            <th colspan="6" >
                                <div class="form-inline">
                                    <div class="form-group">
                                        <label >默认运费:</label>
                                        <input  type="text" class="form-control" v-model="freightTemplate.firstUnit" >
                                    </div>
                                    <div class="form-group">
                                        <label v-if="freightTemplate.valuationWay === 'weight'">Kg内,</label>
                                        <label v-else>件内,</label>
                                        <input  type="text" class="form-control" v-model="freightTemplate.firstPrice"/>
                                    </div>
                                    <div class="form-group">
                                        <label >元,每增加</label>
                                        <input  type="text" class="form-control" v-model="freightTemplate.continueUnit"/>
                                    </div>
                                    <div class="form-group">
                                        <label v-if="freightTemplate.valuationWay === 'weight'">Kg,增加运费</label>
                                        <label v-else>件,增加运费</label>
                                        <input  type="text" class="form-control" v-model="freightTemplate.continuePrice"/>
                                        元
                                    </div>
                                </div>
                            </th>
                        </tr>
                        <tr>
                            <th></th>
                            <th>运送到</th>
                            <th><div v-if="freightTemplate.valuationWay === 'weight'">首重(kg)</div><div v-else>首件</div></th>
                            <th><div v-if="freightTemplate.valuationWay === 'weight'">首重费用</div><div v-else>首件费用</div></th>
                            <th><div v-if="freightTemplate.valuationWay === 'weight'">续重(kg)</div><div v-else>续件</div></th>
                            <th><div v-if="freightTemplate.valuationWay === 'weight'">续重费用</div><div v-else>续件费用</div></th>
                        </tr>
                        <tbody v-for="(item,index) in freightAreaList">
                            <tr>
                                <td>
                                    <a class='addBtn'  @click='showCity(index)'>编辑</a>
                                    <a class='addBtn'  @click='delCity(index)'>删除</a>
                                </td>
                                <td>
                                    <input class='form-control ' readonly="readonly" v-model=freightAreaList[index].areaNames >
                                    <input class='form-control ' type="hidden" v-model=freightAreaList[index].areaIds >
                                </td>
                                <td><input class='form-control' v-model=freightAreaList[index].firstUnit ></td>
                                <td><input class='form-control' v-model=freightAreaList[index].firstPrice ></td>
                                <td><input class='form-control' v-model=freightAreaList[index].continueUnit ></td>
                                <td><input class='form-control' v-model=freightAreaList[index].continuePrice ></td>
                            </tr>
                        </tbody>
                    </table>
                    <a class="btn btn-primary btn-sm" @click="addCity">为指定城市设置运费</a>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">特定条件免邮:</div>
                <div class="col-sm-6">
                    <table id="trFreight2" class="controls table-striped table-bordered table-condensed" style="width: 100%;">
                        <tr>
                            <th></th>
                            <th>运送到</th>
                            <th>设置包邮件数</th>
                        </tr>
                        <tbody v-for="(item,index) in freightAreaList2">
                        <tr>
                            <th>
                                <a class='addBtn'  @click='showFreeArea(index)'>编辑</a>
                                <a class='addBtn'  @click='delFreeArea(index)'>删除</a>
                            </th>
                            <td>
                                <input class='form-control ' readonly="readonly" v-model=freightAreaList2[index].areaNames >
                                <input class='form-control ' type="hidden" v-model=freightAreaList2[index].areaIds >
                            </td>
                            <td><input class='form-control' v-model=freightAreaList2[index].firstUnit ></td>
                        </tr>
                        </tbody>
                    </table>
                    <a class="btn btn-primary btn-sm" @click="addFreeArea">选择地址</a>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">是否默认模板:</div>
                <div class="col-sm-1">
                    <select class="form-control" v-model="freightTemplate.defTemplate">
                        <option class="form-control" selected="selected" value="0">非默认模板</option>
                        <option class="form-control" value="1">默认模板</option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label">是否失效:</div>
                <div class="col-sm-1">
                    <select class="form-control" v-model="freightTemplate.disabled">
                        <option class="form-control" selected="selected" value="0">不失效</option>
                        <option class="form-control" value="1">失效</option>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <div class="col-sm-2 control-label"></div>
                <div class="col-sm-5 control-label">
                    <div class="col-sm-1 control-label">
                        <input type="button" class="btn btn-primary" @click="saveOrUpdate" value="确定"/>
                    </div>
                    <div class="col-sm-1 control-label"></div>
                    <div class="col-sm-1 control-label">
                        <input type="button" class="btn btn-warning" @click="reload" value="返回"/>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <!--运费详细信息-->
    <div id="freightLayer" style="display: none;">
        <table class="table table-striped table-bordered table-condensed">
            <thead>
                <tr>
                    <th style="width:500px">运送到</th>
                    <th style="width:100px">
                        <div v-if="freightTemplate.valuationWay === 'weight'">首重(Kg)</div>
                        <div v-else>首件(件)</div>
                    </th>
                    <th style="width:100px">首重费用(元)</th>
                    <th style="width:100px">
                        <div v-if="freightTemplate.valuationWay === 'weight'">续重(Kg)</div>
                        <div v-else>续件(件)</div>
                    </th>
                    <th style="width:100px">
                        <div v-if="freightTemplate.valuationWay === 'weight'">续件费用(Kg)</div>
                        <div v-else>续件费用(元)</div>
                    </th>
                    <th style="width:100px">是否满件包邮</th>
                </tr>
            </thead>
            <tr>
                <td>未被划分的配送地区自动归于默认运费</td>
                <td>{{freightTemplate.firstUnit}}</td>
                <td>{{freightTemplate.firstPrice}}</td>
                <td>{{freightTemplate.continueUnit}}</td>
                <td>{{freightTemplate.continuePrice}}</td>
                <td></td>
            </tr>
            </thead>
            <tbody v-for="freightArea in freightAreaList">
                <tr>
                    <td>{{freightArea.areaNames}}</td>
                    <td>{{freightArea.firstUnit}}</td>
                    <td>{{freightArea.firstPrice}}</td>
                    <td>{{freightArea.continueUnit}}</td>
                    <td>{{freightArea.continuePrice}}</td>
                    <td v-if="freightArea.rule === 'freeShipping'">
                        包邮
                    </td>
                    <td v-if="freightArea.rule != 'freeShipping'">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    <el-dialog
            title="提示"
            :visible.sync="freightDialog"
            width="30%"
            center>
        <el-tree :data="allRegions" ref="regionRef"  check-strictly show-checkbox @node-click="handleNodeClick"></el-tree>
        <span slot="footer" class="dialog-footer">
            <el-button @click="freightDialog = false">取 消</el-button>
            <el-button type="primary" @click="enterCityChoice">确 定</el-button>
        </span>
    </el-dialog>

</div>
<script src="${request.contextPath}/statics/js/modules/freightages/freighttemplateNew.js?_${.now?long}"></script>

</body>
</html>
<style>
    dd.first_dd_list a{padding:2px 10px;}
    dd.first_dd_list a.select{background: #6f6f6f;color: aliceblue;}
    dd ul li{height:25px}
    dd div{height:25px}
    dd a{color: #0e0e0e;}
</style>